<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" type="text/css" href="/static/index/css/public.css" />
    <link rel="stylesheet" type="text/css" href="/static/index/css/css.css" />

    <script type="text/javascript" src="/static/index/js/jquery.min.js"></script>
    <script type="text/javascript" src="/static/layer/layer.js"></script>


    <style>
        .cf:after{clear:both}.cf{zoom:1;}
        .fl{float: left;}
        .eachClassifyWrap{width: 100%;}
        .subClassifyBox{min-width: 150px;}
        .subClassifyInput,.subLimit{width: 20px;height: 20px;margin-right:10px;border:1px solid #F4F4F4;}
        .subClassify,.subClassifyInnerWrap{width: 90%;}
        .subClassify,.subClassifyBox{margin-bottom: 10px;}
        .subClassifyBox{margin-left: 50px;}
        .subClassifyInnerWrap{margin-left: 80px;}
        .eachClassifyInner{width: 100px;margin-bottom: 10px;}

    </style>

    <script>
        $(function(){
            //全选和反选
            $(document).on("click",'.subClassifyInput',function(){
                if($(this).get(0).checked){
                   $(this).parents(".subClassify").find(".subLimit").prop('checked',true);
                }else{
                    $(this).parents(".subClassify").find(".subLimit").prop('checked',false);
                }
            });

            //全选和反选是否被选择
            $(document).on("click",'.subLimit',function(){
                if($(this).get(0).checked){
                    $(this).parents(".subClassify").find(".subClassifyInput").prop('checked',true);
                }

                if(!$(this).get(0).checked && !$(this).parents(".eachClassifyInner").siblings().find(".subLimit").get(0).checked){
                    $(this).parents(".subClassify").find(".subClassifyInput").prop('checked',false);
                }
            });

        });
    </script>
</head>
<body>

<div style="margin-top: 20px;">
    <div>
        <form id="roleform" class="layui-form formBtn" action="">
            <div>
                <input name="id" type="hidden" value="{$id}">
                <ul class="eachClassifyWrap cf">
                    {foreach name="$role" item="val"}
                    <li class="subClassify fl cf">
                        <div class="subClassifyBox fl cf">
                            <input class="subClassifyInput fl" name="class_id[]" value="{$val.id}" {if condition="$val.selected eq 1"} checked="checked" {/if} type="checkbox">
                            <p class="fl">{$val.title}</p>
                        </div>
                        <ul class="subClassifyInnerWrap cf fl">
                            {foreach name="$val.second" item="v"}
                            <li class="eachClassifyInner fl">
                                <div class="eachClassifyBox cf">
                                    <input class="subLimit fl"name="rid[]" value="{$v.id}" {if condition="$v.selected eq 1"} checked="checked" {/if} type="checkbox">
                                    <p class="fl">{$v.title}</p>
                                </div>
                            </li>
                            {/foreach}
                        </ul>
                    </li>
                    {/foreach}
                </ul>
            </div>

            <div class="submit-btn" id="submit">提交</div>

        </form>
    </div>
</div>

<script>
    $("#submit").on('click',function(){
        $.ajax({
            type:'post',
            url:"/admin/role/roleDistr.html",
            data:$("#roleform").serialize(),
            dataType:'json',
            success:function(data){
                if(data.code == 1){
                    layer.msg(data.msg,{icon:1,time:2000},function(){
                        var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                        parent.layer.close(index);
                        parent.location.reload();
                    });
                }
                if(data.code == 0){
                    layer.msg(data.msg,{icon:2,time:2000});
                }
            }
        })
        return false;
    })
</script>
</body>
</html>